
<!-- 换底色 -->
<template>
	<view class="fill-width-height" :class="$thatThemeClassName">
		<view class="item_row flex-row justify-center align-center fill-width" style="padding: 10px;">
		  <text class="text">需更改颜色：</text>
		  <view class="flex-1 flex-row justify-start">
			  <uv-pick-color ref="pickerColor" :color="color" @confirm="confirm"></uv-pick-color>
			  <uv-button @click="openColor" text="选择颜色"></uv-button>
		  </view>
		</view>
		
		<ImgEdit :extFileId="fileId" @afterRead="afterRead"/>
	</view>
</template>
<script>
	import ImgEdit from './imgEdit'
	import sharePages from '@/framework/plugins/sharePages'
	export default {
		mixins: [sharePages],
		name: 'changeBackColor',
		components: {
			ImgEdit
		},
		data(){
			return {
				fileId: '',
				color: '#8993A4'
			}
		},
		methods: {
			openColor() {
				this.$refs.pickerColor.open();
			},
			confirm(e) {
				this.fontColor = e.hex
			},
			afterRead(file){
				this.fileId = ''
				uni.uploadFile({
					url: 'imgStore/imageTool/changeBackColor',
					filePath: file.url,
					name: 'file',
					formData: {
						newColor: this.color
					},
					success: (res) => {
						this.fileId = res.data?.msg || ''
					}
				})
			}
		}
	}
</script>
